<template>
    <div class="common-print-tem-container">
  
    </div>
  </template>
  
  <script lang="ts" setup>
  import {computed} from "vue";
  
  const props = defineProps({
    printTem: {
      type: Number,
      default: 1
    },
    selector: {
      type: String,
      default: ''
    },
    fontSize: {
      type: String,
      default: '14px'
    }
  })
  
  const fontSizeV = computed(() => {
    return props.fontSize
  })
  
  const buildDom = () => {
    let ele: any = document.querySelector('.common-print-tem-container')
    ele.innerHTML = ''
    let dom = document.querySelector(props.selector)
    if (dom) {
      let domClone = dom.cloneNode(true)
      ele.appendChild(domClone)
    }
  }
  
  
  const clearDom = () => {
    let ele: any = document.querySelector('.common-print-tem-container')
    ele.innerHTML = ''
  }
  
  defineExpose({
    buildDom,
    clearDom
  })
  
  </script>
  
  <style lang="less" scoped>
  .common-print-tem-container {
    position: fixed;
    top: 99999px;
    left: 0;
    z-index: -99999;
  
    :deep(table) {
      font-size: v-bind(fontSizeV) !important;
    }
  
    :deep(.ant-table-wrapper) {
      .ant-table-body {
        max-height: none !important;
      }
    }
  }
  
  </style>